<div>
  <section class="create-room-room-wrapper">
    <div class="create-room-group-select-wrapper">
      <label class="create-room-group-select-label">
        Community
      </label>
      <div class="create-room-group-input js-create-room-group-input"></div>
      <a href="#createcommunity" class="create-room-create-community-link">
        <i class="create-room-create-community-icon icon-globe"></i> Create New Community
      </a>
    </div>
    <div class="create-room-name-select-wrapper">
      <label class="create-room-name-select-label" for="create-room-name-input">
        Room Name
      </label>
      <div class="create-room-name-input-wrapper">
        <input
          class="create-room-name-input js-create-room-name-input"
          id="create-room-name-input"
          pattern="[a-zA-Z0-9\-_\.]+"
          required
          value="">
        <i class="create-room-name-input-clear-button icon-cancel-circle js-create-room-clear-name-button"></i>
      </div>
      <a href="" class="hidden create-room-associated-github-project-link js-associated-github-project-link" target="_blank">
        <i class="create-room-associated-github-project-icon octicon octicon-repo"></i>
        <span class="js-associated-github-project-name"></span>
      </a>
    </div>
  </section>

  <section class="create-room-security-section">
    <ul class="create-room-security-list">
      <li class="create-room-security-list-item">
        <input
          type="radio"
          class="create-room-security-list-item-radio js-create-room-security-radio js-create-room-security-public-radio"
          id="create-room-public-security"
          name="create-room-security"
          value="PUBLIC"
          checked>
        <label class="create-room-security-list-item-label" for="create-room-public-security">
          <i class="create-room-security-list-item-icon octicon octicon-globe"></i>
          <span>
            <span class="create-room-security-list-item-name">Public</span>
            <br>
            <span>
              Anyone in the world can join.
            </span>
          </span>
        </label>
      </li>
      <li class="create-room-security-list-item">
        <input
          type="radio"
          class="create-room-security-list-item-radio js-create-room-security-radio js-create-room-security-private-radio"
          id="create-room-private-security"
          name="create-room-security"
          value="PRIVATE">
        <label class="create-room-security-list-item-label" for="create-room-private-security">
          <i class="create-room-security-list-item-icon octicon octicon-lock"></i>
          <span>
            <span class="create-room-security-list-item-name">Private</span>
            <br>
            <span>
              Only people added to the room can join.
            </span>
          </span>
        </label>
      </li>
    </ul>
  </section>

  <section class="create-room-detail-section js-create-room-detail-section">
    <ul class="create-room-detail-option-list">
      <li class="create-room-detail-option-item js-create-room-only-github-users-option">
        <input
          type="checkbox"
          class="create-room-detail-option-item-input js-create-room-only-github-users-option-input"
          id="create-room-only-github-users"
          value="public">
        <label class="create-room-detail-option-item-label" for="create-room-only-github-users">
          Only GitHub users can join this room
        </labe>
      </li>
      <li class="create-room-detail-option-item hidden js-create-room-only-group-users-option">
        <input
          type="checkbox"
          class="create-room-detail-option-item-input js-create-room-only-group-users-option-input"
          id="create-room-only-org-users"
          value="public">
        <label class="create-room-detail-option-item-label" for="create-room-only-org-users">
          Members of <span class="js-create-room-only-group-users-option-group-name">...</span> can join this room
        </labe>
      </li>
      <li class="create-room-detail-option-item hidden js-create-room-allow-badger">
        <input
          type="checkbox"
          class="create-room-detail-option-item-input js-create-room-allow-badger-option-input"
          id="create-room-allow-badger"
          value="public"
          checked>
        <label class="create-room-detail-option-item-label" for="create-room-allow-badger">
          Send PR to add Gitter badge to README
        </labe>
      </li>
    </ul>
  </section>

  <section>
    <div class="create-room-availability-status-message js-room-availability-status-message"></div>
  </sectio>

</div>
